﻿//上传主程序
function uploadfile(o) {
    //alert(o);
    //准备显示的图片(不能在这里创建，否者ie图片不能根据height按比例缩小)
    //var img = document.createElement("img");
    //img.title = "双击图片可删除图片";
    //img.height = "100";

    var self = $(o);
    if (!self) { return; }
    //self:上传按钮;    
    var parentDiv = self.parent(); //整个上传的容器    
    var imgDiv = parentDiv.find(".fileimgdiv").eq(0); //用户显示图片的div
    var imgupfile = parentDiv.find("input:file").eq(0); //上传控件
    var span = imgupfile.parent(); //上传按钮的父级。
    var ImageHideFile = parentDiv.find("input:hidden").eq(0); //图片隐藏域。
    if (imgupfile.val() == "") {
        alert("请选择要上传的图片！");
        return false;
    }
    else {
        if (!checkImgType(imgupfile.val())) {
            alert("格式不正确,只能上传格式为gif|jpeg|jpg|png|bmp！");
            return false;
        }
    }

    //如果已有图片，则先把图片删除
    if (ImageHideFile.val() != "") {
        var url = "/Public/Delete/" + "?id=" + ImageHideFile.val() + "&ra=" + Math.random();
        $.get(url, function (data) { ImageHideFile.val(""); imgDiv.find("img").eq(0).remove() });
    }
    //准备表当
    var myform = document.createElement("form");
    myform.action = "/Public/Upload";
    myform.method = "post";
    myform.enctype = "multipart/form-data";
    myform.style.display = "none";
    //将表单加当document上，
    document.body.appendChild(myform);  //创建表单后一定要加上这句否则得到的form不能上传。document后要加上body,否则火狐下不行。
    var form = $(myform);

    var fu = imgupfile.clone(true).val(""); //先备份自身,用于提交成功后，再次附加到span中。
    var fu1 = imgupfile.appendTo(form); //然后将自身加到form中。此时form中已经有了file元素。

    //将上传等待图标附加到span此时，span中只用这个等待的图片（上传控件self不在了）。
    span.html("<img src=\"/Content/images/loading.gif\" />&nbsp;&nbsp;&nbsp;正在上传..&nbsp;&nbsp;");

    //开始模拟提交表当。
    form.ajaxSubmit({
        success: function (data) {
            if (data == "NoFile" || data == "Error" || data == "格式不正确！") {
                alert(data);
            }
            else {
                //文件上传成功，返回图片的路径。将路经赋给隐藏域
                ImageHideFile.val(data);
                //如果上传成功，则移走现有的图片（实际上在服务其已经不存在了），然后再把新上传的图片加到div上。
                if (imgDiv.find("img").eq(0)) { imgDiv.find("img").eq(0).remove(); }
                var img = document.createElement("img");
                img.title = "双击图片可删除图片";
                img.height = "100";
                var myimg = $(img);
                imgDiv.append(myimg); //要先append再给img赋值，否则在ie下不能缩小宽度。
                myimg.attr("src", "http://img.youlanye.com/product/" + data); //给img赋值。


                //给img绑定双击删除事件。
                myimg.bind("dblclick",
                    function () {
                        if (ImageHideFile.val() == "") {
                            return;
                        }
                        //alert(ImageHideFile.val());
                        var url = "/Public/Delete/" + "?id=" + ImageHideFile.val() + "&ra=" + Math.random();
                        $.get(url, function (data) {
                            alert(data);
                            if (data == "Success") {
                                ImageHideFile.val("");
                                myimg.remove();
                            }
                        });
                    });
            }
            span.html(fu);
            form.remove();
        }
    });
}

//初始页面，若ImageHideFile有值，则将图片显示出来。
//如果刷新页面图片不在了，但是隐藏域中有图片的地址，则将图片显示出来。
//可惜在ie下用js可以向隐藏域中添加值，但是只要刷新页面，
//隐藏域中的值就不再了，只能保存从后台赋的值。
//但是在火狐是可以的，所以在火狐下，只要你上传了图片，不管你怎么刷新图片不不会消失。
function initImg() {
    var list = $(document).find(".fileimgdiv");
    list.each(function () {
        //准备显示的图片
        var img = document.createElement("img");
        img.title = "双击图片可删除图片";
        img.height = "100";

        var ImageHideFile = $(this).parent().find("input:hidden").eq(0); //图片隐藏域。
        var imgDiv = $(this); //.parent().find(".fileimgdiv").eq(0); //用户显示图片的div
        if (imgDiv.find("img")) { imgDiv.find("img").remove(); }

        if ($.trim(ImageHideFile.val()) != "" && $(img)) {
            imgDiv.append($(img)); //要先append再给img赋值，否则在ie下不能缩小宽度。 
            $(img).attr("src", ImageHideFile.val()); //给img赋值。
            //alert($.trim(ImageHideFile.val()));
            $(img).bind("dblclick",
                    function () {
                        if (ImageHideFile.val() == "") {
                            return;
                        }
                        var url = "/Public/Delete/" + "?id=" + ImageHideFile.val() + "&ra=" + Math.random();
                        $.get(url, function (data) {
                            alert(data);
                            if (data == "Success") {
                                ImageHideFile.val("");
                                $(img).remove();
                            }
                        });
                    });
        }
    });
}
//这个不多说。
$(document).ready(function () {
    initImg();
});

//检查上传的图片格式
function checkImgType(filename) {
    var pos = filename.lastIndexOf(".");
    var str = filename.substring(pos, filename.length)
    var str1 = str.toLowerCase();
    if (!/\.(gif|jpg|jpeg|png|bmp)$/.test(str1)) {
        return false;
    }
    return true;
}
